/**
 * Fetch data for Zone 4
 */
//Class Chart
//Column
Ext.define('Cps.chart.Column', {
	extend : 'Ext.chart.Chart',
	alias : 'widget.chartColumn',
	
	series: {
		type: 'bar',
		axis: 'left',
		xField: 'obj',
		yField: 'value',
		style: {
			minGapWidth: 20
		},
		highlight: {
			strokeStyle: 'black',
			fillStyle: '#c1e30d',
			lineDash: [5, 3]
		},
		label: {
			field: 'value',
			display: 'insideEnd'
		}
	},
	insetPadding: {
		top: 40,
		bottom: 40,
		left: 20,
		right: 40
	},
	interactions: 'itemhighlight',
	animation: Ext.isIE8 ? false : {
		easing: 'bounceOut',
		duration: 500
	},
	axes: [{
		type: 'numeric',
		position: 'left',
		titleMargin: 20,
		title: {
			text: 'Value',
			fontSize: 14
		}
	}, {
		type: 'category',
		position: 'bottom'
	}]
});
//Line
Ext.define('Cps.chart.Line',{
	extend : 'Ext.chart.Chart',
	alias : 'widget.chartLine',
	width: '100%',
	insetPadding: 40,
	innerPadding: {
		left: 40,
		right: 40
	},
	axes: [{
		type: 'numeric',
		fields: 'value',
		position: 'left',
		grid: true,
	}, {
		type: 'category',
		fields: 'obj',
		position: 'bottom',
		grid: true,
		label: {
			rotate: {
				degrees: -45
			}
		}
	}],
	series: [{
		type: 'line',
		xField: 'obj',
		yField: 'value',
		style: {
			lineWidth: 4
		},
		marker: {
			radius: 4
		},
		label: {
			field: 'value',
			display: 'over'
		},
		highlight: {
			fillStyle: '#000',
			radius: 5,
			lineWidth: 2,
			strokeStyle: '#fff'
		},
		tooltip: {
			trackMouse: true,
			style: 'background: #fff',
			showDelay: 0,
			dismissDelay: 0,
			hideDelay: 0,
			renderer: function(storeItem, item) {
				this.setHtml(storeItem.get('obj') + ': ' + storeItem.get('value'));
			}
		}
	}]
});
//Pie
Ext.define('Cps.chart.Pie',{
	extend : 'Ext.chart.Chart',
	alias : 'widget.chartPie',
	width: '100%',
	insetPadding: 30,
	innerPadding: 20,
	legend: {
		docked: 'bottom'
	},
	interactions: ['rotate', 'itemhighlight'],
	series: [{
		type: 'pie',
		angleField: 'value',
		label: {
			field: 'obj',
			display: 'outside',
			calloutLine: {
				length: 40,
				width: 3
				// specifying 'color' is also possible here
			}
		},
		highlight: true,
		tooltip: {
			trackMouse: true,
			renderer: function(storeItem, item) {
				this.setHtml(storeItem.get('obj') + ': ' + storeItem.get('value'));
			}
		}
	}]
});
//Bar
Ext.define('Cps.chart.Bar',{
	extend : 'Ext.chart.Chart',
	alias : 'widget.chartBar',
	width: '100%',
	animation: {
		easing: 'easeOut',
		duration: 500
	},
	flipXY: true,
	insetPadding: 40,
	theme: 'Sky',
	interactions: 'itemhighlight',
	axes: [{
		type: 'numeric',
		position: 'bottom',
		fields: 'value',
		grid: true
	}, {
		type: 'category',
		position: 'left',
		fields: 'obj',
		grid: true
	}],
	series: [{
		type: 'bar',
		xField: 'obj',
		yField: 'value',
		style: {
			opacity: 0.80,
			minGapWidth: 10
		},
		highlight: {
			strokeStyle: 'black',
			fillStyle: '#57cbd1',
			radius: 10
		},
		label: {
			field: 'value',
			display: 'insideEnd'
		},
		tooltip: {
			trackMouse: true,
			style: 'background: #fff',
			renderer: function(storeItem, item) {
				this.setHtml(storeItem.get('obj') + ': ' + storeItem.get('value'));
			}
		}
	}]
});
//Area
Ext.define('Cps.chart.Area',{
	extend : 'Ext.chart.Chart',
	alias : 'widget.chartArea',
	width: '100%',
	insetPadding: 40,
	axes: [{
		type: 'numeric',
		position: 'left',
		grid: true,
		fields: ['value'],
	}, {
		type: 'category',
		position: 'bottom',
		grid: true,
		fields: ['obj'],
		label: {
			rotate: {
				degrees: -45
			}
		}
	}],
	series: [{
		type: 'area',
		axis: 'left',
		xField: 'obj',
		yField: 'value',
		style: {
			opacity: 0.80
		},
		highlight: {
			fillStyle: '#000',
			lineWidth: 2,
			strokeStyle: '#fff'
		},
		tooltip: {
			trackMouse: true,
			style: 'background: #fff',
			renderer: function(storeItem, item) {
				this.setHtml(storeItem.get('obj') + ': ' + storeItem.get('value'));
			}
		}
	}]
});
//Donut
Ext.define('Cps.chart.Donut',{
	extend : 'Ext.chart.Chart',
	alias : 'widget.chartDonut',
	width: '100%',
	insetPadding: 30,
	innerPadding: 20,
	legend: {
		docked: 'bottom'
	},
	interactions: ['rotate', 'itemhighlight'],
	series: [{
		type: 'pie',
		angleField: 'value',
		donut: 50,
		label: {
			field: 'obj',
			display: 'outside'
		},
		highlight: true,
		tooltip: {
			trackMouse: true,
			style: 'background: #fff',
			renderer: function(storeItem, item) {
				this.setHtml(storeItem.get('obj') + ': ' + storeItem.get('value'));
			}
		}
	}]
});
//Radial
Ext.define('Cps.chart.Radial',{
	extend : 'Ext.chart.Chart',
	alias : 'widget.chartRadial',
	width: '100%',
	insetPadding: 40,
	interactions: ['rotate', 'itemhighlight'],
	axes: [{
		type: 'numeric',
		position: 'radial',
		fields: 'value',
		grid: true,
		majorTickSteps: 4
	}, {
		type: 'category',
		position: 'angular',
		grid: true
	}],
	series: [{
		type: 'radar',
		xField: 'obj',
		yField: 'value',
		style: {
			opacity: 0.80
		},
		highlight: {
			fillStyle: '#000',
			lineWidth: 2,
			strokeStyle: '#fff'
		},
		tooltip: {
			trackMouse: true,
			style: 'background: #fff',
			renderer: function(storeItem, item) {
				this.setHtml(storeItem.get('obj') + ': ' + storeItem.get('value'));
			}
		}
	}]
});
//Scatter
Ext.define('Cps.chart.Scatter',{
	extend : 'Ext.chart.Chart',
	alias : 'widget.chartScatter',
	width: '100%',
	store: Ext.create('Ext.data.JsonStore', {
		fields: ['x', 'y' ],
		data: [
			{ x: 5, y: 20 },
			{ x: 480, y: 90 },
			{ x: 250, y: 50 },
			{ x: 100, y: 33 },
			{ x: 330, y: 95 },
			{ x: 410, y: 12 },
			{ x: 475, y: 44 },
			{ x: 25, y: 67 },
			{ x: 85, y: 21 },
			{ x: 220, y: 88 },
			{ x: 320, y: 79 },
			{ x: 270, y: 32 }
		]
	}),
	insetPadding: 40,
	interactions: 'itemhighlight',
	axes: [{
		type: 'numeric',
		position: 'bottom',
		fields: ['x'],
		grid: true
	}, {
		type: 'numeric',
		position: 'left',
		fields: ['y'],
		grid: true
	}],
	series: [{
		type: 'scatter',
		xField: 'x',
		yField: 'y',
		marker: {
			radius: 4
		},
		highlight: {
			fillStyle: 'yellow',
			radius: 7,
			lineWidth: 2
		},
		label: {
			field: 'x',
			display: 'over',
			font: '14px',
			renderer: function(text, label, labelCfg, data, index) {
				var record = data.store.getAt(index);
				return record.get('x') + ',' + record.get('y');
			}
		}
	}]
});
//Zone 4
Ext.define('Cps.view.dashboard.Zone4', {
	
	config: {
		params: {},
        panel: null //the panel to display
	},
	
	constructor: function(config) {
		if(config)
			this.initConfig(config);
	},
	
	redererValue: function(data, meta, rec, row, col){
		if(!data)
			data = '';
		else {
			str = data >= 0 ? Ext.util.Format.number(data, '0,000.00000') : ('-' + Ext.util.Format.number(-data, '0,000.00000'));
			str = str.replace(/[,]/g,"'");
			data = (data > 0) ? ('<div style="text-align: right;color:blue">' + str + '</div>') : ('<div style="text-align: right;color:red">' + str + '</div>');
		}
		return data;
	},
	
	redererValue1: function(data, meta, rec, row, col){
		if(!data)
			data = '';
		else {
			str = data >= 0 ? Ext.util.Format.number(data, '0,000.00000') : ('-' + Ext.util.Format.number(-data, '0,000.00000'));
			str = str.replace(/[,]/g,"'");
			data = (data > 0) ? ('<div style="text-align: right">' + str + '</div>') : ('<div style="text-align: right">' + str + '</div>');
		}
		return data;
	},
	
	redererValue2: function(data, meta, rec, row, col){
		if(!data)
			data = '';
		else {
			str = data >= 0 ? Ext.util.Format.number(data, '0,000.00') : ('-' + Ext.util.Format.number(-data, '0,000.00'));
			str = str.replace(/[,]/g,"'");
			data = (data > 0) ? ('<div style="text-align: right;color:blue">' + str + '</div>') : ('<div style="text-align: right;color:red">' + str + '</div>');
		}
		return data;
	},
	
	redererValue3: function(data, meta, rec, row, col){
		if(!data)
			data = '';
		else {
			str = data >= 0 ? Ext.util.Format.percent(data/100, '0.00') : ('-' + Ext.util.Format.percent(-(data/100), '0.00'));
			data = (data > 0) ? ('<div style="text-align: right">' + str + '</div>') : ('<div style="text-align: right">' + str + '</div>');
		}
		return data;
	},
	
	init: function(typeColumn,typeStore) {
		if (Ext.getCmp('mask') != undefined) 
			Ext.getCmp('mask').show();
		else
		{
			var myMask = new Ext.LoadMask(Ext.getCmp("zone4"), {id: 'mask', msg:"Please wait..."});
			myMask.show();
		}
		//Ext.getCmp("zone4").mask('Please wait...');
		//build column
		var columns = [], store;
        switch (typeColumn)
        {
			case "1":
				columns = [
		        {
			        text: Cps.Locale.Zone4.column6,
			        dataIndex: 'PosInvestmentCode',
					groupable: true,
			        flex: 1,
			        sortable: true
		        },
		        {
			        text: Cps.Locale.Zone4.column1,
			        dataIndex: 'PosName',
					groupable: true,
			        flex: 1,
			        sortable: true
		        },
		        {
			        text: Cps.Locale.Zone4.column2,
			        dataIndex: 'PosCurrency',
							groupable: true,
							width: 55,
			        sortable: true,
		        },
                {
                    text: Cps.Locale.Zone4.column3,
			        dataIndex: 'PosQuantity',
					groupable: true,
			        flex: 1,
			        sortable: true,
			        renderer: this.redererValue
                },
		        {
			        text: Cps.Locale.Zone4.column7,
			        dataIndex: 'PosPrice',
					groupable: true,
			        flex: 1,
			        sortable: true,
			        renderer: this.redererValue1
		        },
				{
			        text: Cps.Locale.Zone4.column8,
			        dataIndex: 'PosAmount',
					groupable: true,
			        flex: 1,
			        sortable: true,
			        renderer: this.redererValue2
		        },
				{
			        text: Cps.Locale.Zone4.column4,
			        dataIndex: 'PosMarketPrice',
					groupable: true,
			        flex: 1,
			        sortable: true,
			        renderer: this.redererValue1
		        },
				{
			        text: Cps.Locale.Zone4.column5,
			        dataIndex: 'PosMarketValue',
					groupable: true,
			        flex: 1,
			        sortable: true,
			        renderer: this.redererValue2
		        },
				{
			        text: Cps.Locale.Zone4.column9,
			        dataIndex: 'PosMarketValueRefCur',
					groupable: true,
			        flex: 1,
			        sortable: true,
			        renderer: this.redererValue2
		        },
				{
			        text: Cps.Locale.Zone4.column10,
			        dataIndex: 'PosRepartition',
					groupable: true,
			        flex: 1,
			        sortable: true,
					renderer: this.redererValue3
        }];
				store = Ext.create('Cps.store.PositionByPortfolios');
				store.initData();
				break;
			case "2":
		        columns = [
		        {
			        text: Cps.Locale.Zone4.column1,
			        dataIndex: 'PosName',
			        flex: 2,
			        sortable: true
							groupable: true,
		        },
		        {
			        text: Cps.Locale.Zone4.column2,
			        dataIndex: 'PosCurrency',
							width: 55,
			        sortable: true
							groupable: true,
		        },
		        {
			        text: Cps.Locale.Zone4.column3,
			        dataIndex: 'PosQuantity',
			        flex: 1,
			        sortable: true,
							groupable: true,
			        renderer: this.redererValue
		        },
                {
                    text: Cps.Locale.Zone4.column4,
			        dataIndex: 'PosMarketPrice',
			        flex: 1,
			        sortable: true,
							groupable: true,
			        renderer: this.redererValue1
                },
		        {
			        text: Cps.Locale.Zone4.column5,
			        dataIndex: 'PosMarketValue',
			        flex: 1,
			        sortable: true,
							groupable: true,
			        renderer: this.redererValue2
		        },
				{
			        text: Cps.Locale.Zone4.column9,
			        dataIndex: 'PosMarketValueRefCur',
			        flex: 1,
			        sortable: true,
							groupable: true,
			        renderer: this.redererValue2
		        }];
				store = Ext.create('Cps.store.PositionByClients');
				store.initData();
                break;
            case "5":
		        columns = [
		        {
			        text: Cps.Locale.Zone4.column1,
			        dataIndex: 'PosName',
			        flex: 2,
			        sortable: true,
							groupable: true,
		        },
		        {
			        text: Cps.Locale.Zone4.column2,
			        dataIndex: 'PosCurrency',
			        flex: 1,
			        sortable: true,
							groupable: true,
		        },
		        {
			        text: Cps.Locale.Zone4.column3,
			        dataIndex: 'PosQuantity',
			        flex: 1,
			        sortable: true,
							groupable: true,
			        renderer: this.redererValue
		        },
                {
                    text: Cps.Locale.Zone4.column4,
			        dataIndex: 'PosMarketPrice',
			        flex: 1,
			        sortable: true,
							groupable: true,
			        renderer: this.redererValue1
                },
		        {
			        text: Cps.Locale.Zone4.column5,
			        dataIndex: 'PosMarketValue',
			        flex: 1,
			        sortable: true,
							groupable: true,
			        renderer: this.redererValue2
		        }];
				switch (typeStore)
				{
					case "1":
						store = Ext.create('Cps.store.PositionByDepositarys');
						store.initData();
						break;
					case "2":
						store = Ext.create('Cps.store.PositionByManagers');
						store.initData();
						break;
					case "3":
						store = Ext.create('Cps.store.AllPositions');
						store.initData();
						break;
				}

                break;
        }
		//do render data
		var grid = Ext.getCmp('gridZone4');
		grid.reconfigure(store,columns);
	},
	initChart: function(typeChart, node) {
		var pn = this.getPanel(), combobox = Ext.getCmp('cbb'), combobox1 = Ext.getCmp('cbb1'), chartCtn = Ext.getCmp('chartCtn');
		var loadmask = new Ext.LoadMask({
			msg    : 'Please wait...',
			target : pn
		});
		loadmask.show();
		if (chartCtn != undefined)
			chartCtn.destroy();
		switch (combobox.getValue())
		{
			case "1":
				var container = Ext.create('Ext.container.Container', {
					id: 'chartCtn',
					autoScroll: true,
					layout: {
						type: 'column'
					},
					items: [
						{
							xtype: 'container',
							columnWidth: .5,
							defaults: {
								border: 1,
								height: 300
							}
						},
						{
							xtype: 'container',
							columnWidth: .5,
							defaults: {
								border: 1,
								height: 300
							}
						}
					]
				});
				Ext.Ajax.request({
					method: 'GET',
					url: Cps.Config.Api.getPositionByPortfolio,
					params: getParamPosition,
					success: function(data) {
						if (IsJson(data.responseText))
						{
							var data1 = [], f_data = [];
							data = Ext.JSON.decode(data.responseText).data;
							data = data ? data.dsPositionByPortfolio : null;
							data1 = data ? data.ttPortfolio : null;
							data = data ? data.ttPositionByPort : null;
							if (data != undefined)
							{
								if (data.length != undefined)
								{
									for(i = 0; i < data.length; i++) {
										for(j = 0; j < data1.length; j++)
										{
											if (data1[j].PortCode == data[i].PortCode)
											{
												data[i].PortCode = data1[j].PortName + ' - ' + data1[j].PortCurrency + ' ' + data1[j].PortTotal;
												f_data.push(data[i]);
												break;
											}
										}
									}
								}
								else
									f_data.push(data);
							}
							var f_data = groupPortfolio(f_data);
							if (node == 1)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctCurrency(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 1),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							else if (node == 2)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctCategory(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 2),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							else if (node == 3)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctDepository(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 3),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							pn.insert(1, container);
							if (combobox1.ownerCt.items.items[0].text != undefined)
								width = textWidth(combobox1.ownerCt.items.items[0].text) + 20;
							else
								width = textWidth(combobox1.ownerCt.items.items[0].textEl.dom.innerText) + 20;
							combobox1.el.setStyle('left',width + 'px');
							loadmask.hide();
						}
					},
					scope: this
				});
				break;
			case "2":
				var container = Ext.create('Ext.container.Container', {
					id: 'chartCtn',
					autoScroll: true,
					layout: {
						type: 'column'
					},
					items: [
						{
							xtype: 'container',
							columnWidth: .5,
							defaults: {
								border: 1,
								height: 300
							}
						},
						{
							xtype: 'container',
							columnWidth: .5,
							defaults: {
								border: 1,
								height: 300
							}
						}
					]
				});
				Ext.Ajax.request({
					method: 'GET',
					url: Cps.Config.Api.getPositionByPortfolio,
					params: getParamPosition,
					success: function(data) {
						if (IsJson(data.responseText))
						{
							var data1 = [], f_data = [];
							data = Ext.JSON.decode(data.responseText).data;
							data = data ? data.dsPositionByPortfolio : null;
							data1 = data ? data.ttPortfolio : null;
							data = data ? data.ttPositionByPort : null;
							if (data != undefined)
							{
								if (data.length != undefined)
								{
									for(i = 0; i < data.length; i++) {
										for(j = 0; j < data1.length; j++)
										{
											if (data1[j].PortCode == data[i].PortCode)
											{
												data[i].PortCode = data1[j].PortName + ' - ' + data1[j].PortCurrency + ' ' + data1[j].PortTotal;
												f_data.push(data[i]);
												break;
											}
										}
									}
								}
								else
									f_data.push(data);
							}
							var f_data = groupPortfolio(f_data);
							if (node == 1)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctCurrency(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 1),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							else if (node == 2)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctCategory(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 2),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							else if (node == 3)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctDepository(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 3),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							pn.insert(1, container);
							if (combobox1.ownerCt.items.items[0].text != undefined)
								width = textWidth(combobox1.ownerCt.items.items[0].text) + 20;
							else
								width = textWidth(combobox1.ownerCt.items.items[0].textEl.dom.innerText) + 20;
							combobox1.el.setStyle('left',width + 'px');
							loadmask.hide();
						}
					},
					scope: this
				});
				break;
			case "3":
				var container = Ext.create('Ext.container.Container', {
					id: 'chartCtn',
					autoScroll: true,
					layout: {
						type: 'column'
					},
					items: [
						{
							xtype: 'container',
							columnWidth: .5,
							defaults: {
								border: 1,
								height: 300
							}
						},
						{
							xtype: 'container',
							columnWidth: .5,
							defaults: {
								border: 1,
								height: 300
							}
						}
					]
				});
				Ext.Ajax.request({
					method: 'GET',
					url: Cps.Config.Api.getPositionByPortfolio,
					params: getParamPosition,
					success: function(data) {
						if (IsJson(data.responseText))
						{
							var data1 = [], f_data = [];
							data = Ext.JSON.decode(data.responseText).data;
							data = data ? data.dsPositionByPortfolio : null;
							data1 = data ? data.ttPortfolio : null;
							data = data ? data.ttPositionByPort : null;
							if (data != undefined)
							{
								if (data.length != undefined)
								{
									for(i = 0; i < data.length; i++) {
										for(j = 0; j < data1.length; j++)
										{
											if (data1[j].PortCode == data[i].PortCode)
											{
												data[i].PortCode = data1[j].PortName + ' - ' + data1[j].PortCurrency + ' ' + data1[j].PortTotal;
												f_data.push(data[i]);
												break;
											}
										}
									}
								}
								else
									f_data.push(data);
							}
							var f_data = groupPortfolio(f_data);
							if (node == 1)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctCurrency(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 1),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							else if (node == 2)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctCategory(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 2),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							else if (node == 3)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctDepository(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 3),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							pn.insert(1, container);
							if (combobox1.ownerCt.items.items[0].text != undefined)
								width = textWidth(combobox1.ownerCt.items.items[0].text) + 20;
							else
								width = textWidth(combobox1.ownerCt.items.items[0].textEl.dom.innerText) + 20;
							combobox1.el.setStyle('left',width + 'px');
							loadmask.hide();
						}
					},
					scope: this
				});
				break;
			case "4":
				var container = Ext.create('Ext.container.Container', {
					id: 'chartCtn',
					autoScroll: true,
					layout: {
						type: 'column'
					},
					items: [
						{
							xtype: 'container',
							columnWidth: .5,
							defaults: {
								border: 1,
								height: 300
							}
						},
						{
							xtype: 'container',
							columnWidth: .5,
							defaults: {
								border: 1,
								height: 300
							}
						}
					]
				});
				Ext.Ajax.request({
					method: 'GET',
					url: Cps.Config.Api.getPositionByPortfolio,
					params: getParamPosition,
					success: function(data) {
						if (IsJson(data.responseText))
						{
							var data1 = [], f_data = [];
							data = Ext.JSON.decode(data.responseText).data;
							data = data ? data.dsPositionByPortfolio : null;
							data1 = data ? data.ttPortfolio : null;
							data = data ? data.ttPositionByPort : null;
							if (data != undefined)
							{
								if (data.length != undefined)
								{
									for(i = 0; i < data.length; i++) {
										for(j = 0; j < data1.length; j++)
										{
											if (data1[j].PortCode == data[i].PortCode)
											{
												data[i].PortCode = data1[j].PortName + ' - ' + data1[j].PortCurrency + ' ' + data1[j].PortTotal;
												f_data.push(data[i]);
												break;
											}
										}
									}
								}
								else
									f_data.push(data);
							}
							var f_data = groupPortfolio(f_data);
							if (node == 1)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctCurrency(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 1),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							else if (node == 2)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctCategory(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 2),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							else if (node == 3)
							{
								for(var i = 0; i < f_data.length; i++)
								{
									var title = f_data[i][0] != undefined ? f_data[i][0].PortCode : '',
										cur = distinctDepository(f_data[i]), 
										store = Ext.create('Ext.data.Store',{
											fields: ['obj','value'],
											data: sumPrice(f_data[i], cur, 3),
											counter: 0
										}),
										chart = Ext.create(typeChart, {
											store: store,
											title: title
										});
									if ( i % 2 == 0)
										container.items.items[0].insert(0,chart);
									else
										container.items.items[1].insert(0,chart);
								}
							}
							pn.insert(1, container);
							if (combobox1.ownerCt.items.items[0].text != undefined)
								width = textWidth(combobox1.ownerCt.items.items[0].text) + 20;
							else
								width = textWidth(combobox1.ownerCt.items.items[0].textEl.dom.innerText) + 20;
							combobox1.el.setStyle('left',width + 'px');
							loadmask.hide();
						}
					},
					scope: this
				});
				break;
			case "5":
				var container = Ext.create('Ext.container.Container', {
					id: 'chartCtn',
					layout: {
						type: 'fit'
					}
				}), f_data = [];
				Ext.Ajax.request({
					method: 'GET',
					url: Cps.Config.Api.getAllPosition,
					params: getParamPosition,
					success: function(data) {
						if (IsJson(data.responseText))
						{
							data = Ext.JSON.decode(data.responseText).data;
							data = data ? data.ttAllPosition : null;
							data = data ? data.ttAllPositionRow : null;
							if (data != undefined)
							{
								if (data.length != undefined)
								{
									for(i = 0; i < data.length; i++) {
										f_data.push(data[i]);
									}
								}
								else
									f_data.push(data);
							}
							if (node == 1)
							{
								var cur = distinctCurrency(f_data), 
									store = Ext.create('Ext.data.Store',{
										fields: ['obj','value'],
										data: sumPrice(f_data, cur, 1),
										counter: 0
									});
							}
							else if (node == 2)
							{
								var cur = distinctCategory(f_data), 
									store = Ext.create('Ext.data.Store',{
										fields: ['obj','value'],
										data: sumPrice(f_data, cur, 2),
										counter: 0
									});
							}
							else if (node == 3)
							{
								var cur = distinctCurrency(f_data), 
									store = Ext.create('Ext.data.Store',{
										fields: ['obj','value'],
										data: sumPrice(f_data, cur, 1),
										counter: 0
									});
							}
							var	chart = Ext.create(typeChart, {
								store: store
							});
							container.insert(0,chart);
							pn.insert(1, container);
							if (combobox1.ownerCt.items.items[0].text != undefined)
								width = textWidth(combobox1.ownerCt.items.items[0].text) + 20;
							else
								width = textWidth(combobox1.ownerCt.items.items[0].textEl.dom.innerText) + 20;
							combobox1.el.setStyle('left',width + 'px');
							loadmask.hide();
						}
					},
					scope: this
				});
				break;
		}
	}
});
